<template>
  <header class="order">
    <el-page-header :icon="Coin" style="margin-top: 10px">
      <template #content>
        <div class="flex items-center">
          <span class="text-large font-600 mr-3">学生信息管理</span>
          <input type="text" placeholder="请输入搜索内容"
                 style="margin-left: 820px;height: 28px;border: none;background-color:whitesmoke" />
          <el-button type="primary">搜索</el-button>
        </div>
      </template>
    </el-page-header>
  </header>
  <article style="margin-top: 20px;caret-color: transparent;">
    <!--  展示学生信息表格-->
    <el-table :data="tableData" stripe style="width: 100%">
      <el-table-column type="selection" width="55" />
      <el-table-column prop="date" label="编号" width="55" />
      <el-table-column prop="city" label="姓名"  sortable width="150" />
      <el-table-column prop="name" label="学校" width="120" />
      <el-table-column prop="state" label="专业" width="120" />
      <el-table-column prop="city" label="学号" width="120" />
      <el-table-column prop="city" label="学院" width="120" />
      <el-table-column prop="city" label="年级" width="120" />
      <el-table-column prop="address" label="电话" width="150" />
      <el-table-column prop="zip" label="邮箱" width="150" />
      <el-table-column fixed="right" label="操作" min-width="165">
        <template #default>
          <el-button link type="primary" size="small">编辑</el-button>
          <el-button link type="warning" size="small" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <footer style="margin-top: 40px">
      <!--分页-->
      <el-pagination background layout="prev, pager, next" :total="100" />
    </footer>
  </article>

</template>
<script setup>
import {
  Coin
} from '@element-plus/icons-vue'
import Navigation from "@/components/Navigation.vue";

const tableData = [
  {
    date: '1',
    name: '2016-05-03',
    state: '2016-05-03',
    city: '2016-05-03',
    address: 'No. 189, Grove St, Los Angesles',
    zip: 'CA 90036',
    tag: 'Home'
  },
  {
    date: '1',
    name: '2016-05-03',
    state: '2016-05-03',
    city: '2016-05-03',
    address: 'No. 189, Grove St, Los Angesles',
    zip: 'CA 90036',
    tag: 'Home'
  }
]
</script>
<style scoped>
.order{
  margin-top: -10px;
  height: 50px;
  padding-top: 20px;
  padding-left: 20px;
  border-radius: 5px;
}


</style>